<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title><%= htmlWebpackPlugin.options.title %></title>


    <!-- 引入样式 -->
    <link rel="stylesheet" href="css/elementui/index.css">
    <link rel="stylesheet" href="css/index.css">
</head>
<style>
    .el-select,.el-input {
        width: 300px
    }
    .line_label .el-form-item__label {
        color: #000000;
        font-weight: bolder;
    }
</style>
<body>
<div id="headTools" style="height: 200px;margin-bottom:20px;box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04)">

    <div style="height: 20px"></div>
    <div style="display: flex;margin-top: 0px">
        <div style="flex: 1;"></div>
        <div style="; width: 1000px">
            <el-form :disabled="true" label-width="75px" size="mini" label-position="left" inline>
                <el-form-item class="line_label" label="试题类型:">
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" plain>+选择题</el-button>
                    <el-button type="primary" plain>+判断题</el-button>
                    <el-button type="primary" plain>+填空</el-button>
                    <el-button type="primary" plain>+英语作文</el-button>
                    <el-button type="primary" plain>+解答</el-button>
                </el-form-item>
            </el-form>
            <el-form style="" label-width="75px" size="mini" inline label-position="left">

                <el-form-item class="line_label" label="基本信息:">
                    <el-checkbox-group v-model="sheetSetting.base">
                        <el-checkbox label="姓名"></el-checkbox>
                        <el-checkbox label="学校"></el-checkbox>
                        <el-checkbox label="班级"></el-checkbox>
                        <el-checkbox label="座位"></el-checkbox>
                    </el-checkbox-group>
                </el-form-item>
                <el-form-item class="line_label"  label="考号数量:">
                    <el-input style="width: 70px" type="number" v-model="sheetSetting.codeNumber"></el-input>
                </el-form-item>
                <el-form-item class="line_label" label="注意事项:">
                    <el-switch
                            v-model="sheetSetting.tip"
                            active-text="开启"
                            inactive-text="关闭">
                    </el-switch>
                </el-form-item>
            </el-form>
            <el-form style="" label-width="75px" size="mini" inline label-position="left">

                <el-form-item>
                    <el-button
                            type="success"
                            @click="download('pdf')">
                        下载PDF
                    </el-button>
                </el-form-item>
                <el-form-item>
                    <el-button
                            :type="parseId ? 'primary': 'success'"
                            plain
                            @click="save">
                        {{parseId ? "更新答题卡" : "保存答题卡"}}
                    </el-button>
                </el-form-item>
            </el-form>
        </div>
        <div style="flex: 1;"></div>
    </div>


    <el-dialog title="题目设置" :visible.sync="setting" >
        <el-form size="mini" :label-width="'80px'" label-position="right">
            <el-form-item label="题目类型">
                <el-select v-model="settings.baseType" placeholder="题目类型">
                    <el-option label="填空" value="tk"></el-option>
                    <el-option label="解答" value="jd"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="输入数量">
                <el-input type="number" v-model="settings.inputNumber" placeholder="题目类型"></el-input>
            </el-form-item>
            <el-form-item label="横线宽度">
                <el-select v-model="settings.inputWidth" placeholder="题目类型">
                    <el-option label="最短" :value="133"></el-option>
                    <el-option label="短" :value="183"></el-option>
                    <el-option label="半行" :value="283"></el-option>
                    <el-option label="整行" :value="600"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="行高">
                <el-select v-model="settings.lineHeight" placeholder="题目类型">
                    <el-option label="40" :value="40"></el-option>
                    <el-option label="50" :value="50"></el-option>
                    <el-option label="60" :value="60"></el-option>
                </el-select>
            </el-form-item>

        </el-form>
        <div slot="footer" class="dialog-footer">
            <el-button @click="setting = false">取 消</el-button>
            <el-button type="primary" @click="handleSetting">确 定</el-button>
        </div>
    </el-dialog>
</div>
<div style="display: flex;">
    <div style="flex: 1"></div>
    <div id="app" style="border: 1px solid black;width: 793px"></div>
    <div style="flex: 1"></div>

</div>


<div style="position: static" id="toolbar">

</div>
<script src="js/axios.min.js"></script>
<script src="js/vue.js"></script>
<script src="js/elementui.js"></script>
<script src="js/fabric.js"></script>
<script>
</script>
</body>
</html>